function removeMenuClasses() {
    $("#menu-layoutit li button").removeClass("active")
}
function changeStructure(e, t) {
    $("#download-layout ." + e).removeClass(e).addClass(t)
}
function cleanHtml(e) {
    $(e).parent().append($(e).children().html())
}
function downloadLayoutSrc() {
    var e = "";
    $("#download-layout").children().html($(".demo").html());
    var t = $("#download-layout").children();
    t.find(".preview, .configuration, .drag, .remove").remove();
    t.find(".lyrow").addClass("removeClean");
    t.find(".box-element").addClass("removeClean");
    t.find(".lyrow .lyrow .lyrow .lyrow .lyrow .removeClean").each(function() {
        cleanHtml(this)
    });
    t.find(".lyrow .lyrow .lyrow .lyrow .removeClean").each(function() {
        cleanHtml(this)
    });
    t.find(".lyrow .lyrow .lyrow .removeClean").each(function() {
        cleanHtml(this)
    });
    t.find(".lyrow .lyrow .removeClean").each(function() {
        cleanHtml(this)
    });
    t.find(".lyrow .removeClean").each(function() {
        cleanHtml(this)
    });
    t.find(".removeClean").each(function() {
        cleanHtml(this)
    });
    t.find(".removeClean").remove();
    $("#download-layout .column").removeClass("ui-sortable");
    $("#download-layout .row-fluid").removeClass("clearfix").children().removeClass("column");
    if ($("#download-layout .container").length > 0) {
        changeStructure("row-fluid", "row")
    }
    // formatSrc = $.htmlClean($("#download-layout").html(), {
    //     format: true,
    //     allowedAttributes: [
    //         ["id"],
    //         ["class"],
    //         ["data-toggle"],
    //         ["data-target"],
    //         ["data-parent"],
    //         ["role"],
    //         ["data-dismiss"],
    //         ["aria-labelledby"],
    //         ["aria-hidden"],
    //         ["data-slide-to"],
    //         ["data-slide"]
    //     ]
    // });
    // $("#download-layout").html(formatSrc);
    // $("#downloadModal textarea").empty();
    // $("#downloadModal textarea").val(formatSrc)
    // alert($("#download-layout").html());
    var editor = window.parent.layui.$('#LAY_editor');
    editor.text($("#download-layout").html());

}

var timerSave = 1000;
var stopsave = 0;
var startdrag = 0;

var tableSize = 0;
var rowSize = 0;
var buttonSize = 0;
var progressbarSize = 0;
var carouselSize = 0;
var navSize = 0;
function handleRowIds(e, t) {
    // var e = $(".demo #demoTable");
    // var e = $(".demo .row-fluid .clearfix .layui-row");
    var e = $('div .demo').find(".layui-row");
    var length=e.length;
    alert("当前页面已经存在行行行行行行行"+length+"个");
    // alert(e.eq(0).html());

    if(rowSize<length) {
        rowSize = length;

        // var sourceElement = $(t.helper.context);
        //这种方式会报错，应该转换成jquery对象
        //var sourceElement = ui.helper.context;
        // var targetElement = $(this);
        // alert(sourceElement.html());
        // alert(sourceElement);

        // var ssse = sourceElement.find(".view");
        // alert("11:"+ssse.html());

        // window.parent.layui.runCodes();

        // console.log("log---" + sourceElement.attr("id") + "---" + targetElement.attr("id"));
        // console.log(sourceElement.data("name") + "---" + targetElement.data("name"))
        // alert("drop");
        // var $sss=$(e)[length-1];
            var genid="html_id_row_"+length;
            // alert(genid);
        e.eq(length-1).attr("id", genid);
            $.ajax({
                type: "post",
                url: "/htmlrow",
                dataType: "json",
                data: {idRowin:genid},
                cache: true,
                success: function (data) {
                    alert("放置成功");
                },
                error: function () {
                    alert("放置失败");
                }
            })
    }

    // var length=$('div .demo').find('table').length;
    // alert("当前页面已经存在了"+length+"个");
    //
    // if(tableSize<length){
    //     tableSize=length;
    //     var genid="html_id_table_"+length;
    //     e.attr("id", genid);
    //     $.ajax({
    //         type: "post",
    //         url: "/htmltable",
    //         dataType: "json",
    //         data: {idTablein:genid},
    //         cache: true,
    //         success: function (data) {
    //             alert("放置成功");
    //         },
    //         error: function () {
    //             alert("放置失败");
    //         }
    //     })
    // }
    // e.attr("href", "#" + n);
    // e.next().attr("id", n)
}



function handleTableIds() {
    var e = $(".demo #demoTable");
    var length=$('div .demo').find('table').length;
    alert("当前页面已经存在了"+length+"个");
   var newTable= $('div .demo').find('table').eq(length-1);
   var inrow= newTable.closest('.layui-row');
   var rowid= inrow.attr('id');
    alert("当前表格所在的行id:"+rowid);
    if(tableSize<length){
        tableSize=length;
        var genid="html_id_table_"+length;
        e.attr("id", genid);
        $.ajax({
            type: "post",
            url: "/htmltable",
            dataType: "json",
            data: {idTablein:genid,rowId:rowid},
            cache: true,
            success: function (data) {
                alert("放置成功");
            },
            error: function () {
                alert("放置失败");
            }
        })
    }
    // e.attr("href", "#" + n);
    // e.next().attr("id", n)
}

function handleStaticButtonIds() {
    var e = $(".demo #demoTable");
    var length=$('div .demo').find('button').length;
    alert("当前页面已经存在了"+length+"个");
   var newButton= $('div .demo').find('button').eq(length-1);
   var inrow= newButton.closest('.layui-row');
   var rowid= inrow.attr('id');
    alert("当前button所在的行id:"+rowid);
    if(buttonSize<length){
        buttonSize=length;
        var genid="html_id_button_"+length;
        newButton.attr("id", genid);
        $.ajax({
            type: "post",
            url: "/htmlbutton",
            dataType: "json",
            data: {idButtonin:genid,rowId:rowid},
            cache: true,
            success: function (data) {
                alert("放置成功");
            },
            error: function () {
                alert("放置失败");
            }
        })
    }
    // e.attr("href", "#" + n);
    // e.next().attr("id", n)
}

function handleStaticProgressbarIds() {
    var length=$('div .demo').find('.layui-progress-bar').length;
    alert("当前页面进度条已经存在了"+length+"个");
   var newButton= $('div .demo').find('.layui-progress-bar').eq(length-1);
   var inrow= newButton.closest('.layui-row');
   var rowid= inrow.attr('id');
    alert("当前progress-bar所在的行id:"+rowid);
    if(progressbarSize<length){
        progressbarSize=length;
        var genid="html_id_progress-bar_"+length;
        newButton.attr("id", genid);
        $.ajax({
            type: "post",
            url: "/htmlprogressbar",
            dataType: "json",
            data: {idProgressbarin:genid,rowId:rowid},
            cache: true,
            success: function (data) {
                alert("放置成功");
            },
            error: function () {
                alert("放置失败");
            }
        })
    }
}

function handleCarouselIds() {
    var e = $(".demo #myCarousel");
    // var t = randomNumber();
    // var n = "carousel-" + t;
    // e.attr("id", n);
    // e.find(".carousel-indicators li").each(function(e, t) {
    //     $(t).attr("data-target", "#" + n)
    // });
    // e.find(".left").attr("href", "#" + n);
    // e.find(".right").attr("href", "#" + n)
    var length=$('div .demo').find('.layui-carousel').length;
    alert("当前页面轮播图已经存在了"+length+"个");
    var newButton= $('div .demo').find('.layui-carousel').eq(length-1);
    var inrow= newButton.closest('.layui-row');
    var rowid= inrow.attr('id');
    alert("当前Carousel所在的行id:"+rowid);
    if(carouselSize<length){
        carouselSize=length;
        var genid="html_id_carousel_"+length;
        newButton.attr("id", genid);
        $.ajax({
            type: "post",
            url: "/htmlcarousel",
            dataType: "json",
            data: {idCarouselin:genid,rowId:rowid},
            cache: true,
            success: function (data) {
                alert("放置成功");
                var carousel=window.parent.document.getElementById('LAY_demo').contentWindow.layui.carousel;
                var carouselMap=window.parent.document.getElementById('LAY_demo').contentWindow.carouselMap;

                //console.log(window.parent.document.getElementById('LAY_demo').contentWindow.carouselMap)//设定各种参数

                console.log(carousel)//设定各种参数
                var ins3 = carousel.render({
                    elem: '#'+genid
                    // ,autoplay:false
                });

                // 添加键
                carouselMap.set(genid,ins3 );
                console.log("当前轮播图Map start")//设定各种参数
                console.log(carouselMap)//设定各种参数
                console.log("当前轮播图Map end")//设定各种参数
               // window.parent.document.getElementById('LAY_demo').contentWindow.layui.ins3=ins3;
            },
            error: function () {
                alert("放置失败");
            }
        })
    }
}

function handleJsIds() {
    // handleRowIds();
    handleTableIds();
    // handleModalIds();
    // handleAccordionIds();
    handleCarouselIds();
    // handleTabsIds()
    handleStaticButtonIds();
    handleStaticProgressbarIds();
}
function initContainer(){
    $(".demo, .demo .column").sortable({
        connectWith: ".column",
        opacity: .35,
        handle: ".drag",
        start: function(e,t) {
            if (!startdrag) stopsave++;
            startdrag = 1;
        },
        stop: function(e,t) {
            if(stopsave>0) stopsave--;
            startdrag = 0;
        }
    });
    configurationElm();
}
function configurationElm(e, t) {
    $(".demo").delegate(".configuration > a", "click", function(e) {
        e.preventDefault();
        var t = $(this).parent().next().next().children();
        $(this).toggleClass("active");
        t.toggleClass($(this).attr("rel"))
    });
    $(".demo").delegate(".configuration .dropdown-menu a", "click", function(e) {
        e.preventDefault();
        var t = $(this).parent().parent();
        var n = t.parent().parent().next().next().children();
        t.find("li").removeClass("active");
        $(this).parent().addClass("active");
        var r = "";
        t.find("a").each(function() {
            r += $(this).attr("rel") + " "
        });
        t.parent().removeClass("open");
        n.removeClass(r);
        n.addClass($(this).attr("rel"))
    })
}
function removeElm() {
    $(".demo").delegate(".remove", "click", function(e) {
        e.preventDefault();

        alert("删除");

        var elementEl=$(this).parent().find('div[class=preview]');

        var ss=elementEl.data("row");

        if(elementEl.data("row")=="row"){
                console.log("删除行");
            var $elementRow=$(this).parent().find('div[class=preview]').next().children('div');
            var ddd=$elementRow.find('div[class=preview]').next().children('div');
            var rmRowids=[];
            console.log("子元素："+ddd.length);
            for(var i=0;i<ddd.length;i++){
                rmRowids.push(ddd.eq(i).attr('id'));
            }
            var id=$elementRow.attr('id');
            rmRowids.push(id);
            alert("伤处的数组大小："+rmRowids.length);
            alert("移除行Id wei :"+id);
            // $.ajax({
            //     type: "POST",
            //     url: "/htmlrow/rowid/"+id,
            //     dataType: "json",
            //     data: {_method:'DELETE'},
            //     cache: true,
            //     success: function (data) {
            //         alert("删除成功");
            //         rowSize--;
            //     },
            //     error: function (data) {
            //         alert("删除失败");
            //     }
            // })
            $.ajax({
                type: "POST",
                url: "/htmlrow/rowid/"+id,
                dataType: "json",
                data: {_method:'DELETE',rowids:rmRowids},
                cache: true,
                success: function (data) {
                    alert("删除成功");
                    rowSize=rowSize-rmRowids.length;
                },
                error: function (data) {
                    alert("删除失败");
                }
            })
        }else if(typeof(elementEl.data("row"))=="undefined"){
            var element=$(this).parent().find('div[class=preview]').text();
            // alert(element);
            if('表格'===element){
                alert("删除表格");
                var $elementTable=$(this).parent().find('div[class=preview]').next().children('table');

                var id=$elementTable.attr('id');
                alert("移除表格Id wei :"+id);
                $.ajax({
                    type: "POST",
                    url: "/htmltable/tableid/"+id,
                    dataType: "json",
                    data: {_method:'DELETE'},
                    cache: true,
                    success: function (data) {
                        alert("删除成功");
                        tableSize--;
                    },
                    error: function (data) {
                        alert("删除失败");
                    }
                })
            }else if('按钮'===element){
                alert("删除按钮");
                var $elementTable=$(this).parent().find('div[class=preview]').next().children('button');

                var id=$elementTable.attr('id');
                alert("移除按钮Id wei :"+id);
                $.ajax({
                    type: "POST",
                    url: "/htmlbutton/buttonid/"+id,
                    dataType: "json",
                    data: {_method:'DELETE'},
                    cache: true,
                    success: function (data) {
                        alert("删除成功");
                        buttonSize--;
                    },
                    error: function (data) {
                        alert("删除失败");
                    }
                })
            }else if('进度条'===element){
                alert("删除进度条");
                var $elementTable=$(this).parent().find('div[class=preview]').next().find('.layui-progress-bar').eq(0);

                var id=$elementTable.attr('id');
                alert("移除进度条Id wei :"+id);
                $.ajax({
                    type: "POST",
                    url: "/htmlprogressbar/progressbarid/"+id,
                    dataType: "json",
                    data: {_method:'DELETE'},
                    cache: true,
                    success: function (data) {
                        alert("删除成功");
                        progressbarSize--;
                    },
                    error: function (data) {
                        alert("删除失败");
                    }
                })
            }else if('轮播图'===element){
                alert("删除轮播图");
                var $elementTable=$(this).parent().find('div[class=preview]').next().find('.layui-carousel').eq(0);

                var id=$elementTable.attr('id');
                alert("移除轮播图Id wei :"+id);
                $.ajax({
                    type: "POST",
                    url: "/htmlcarousel/carouselid/"+id,
                    dataType: "json",
                    data: {_method:'DELETE'},
                    cache: true,
                    success: function (data) {
                        alert("删除成功");
                        carouselSize--;
                    },
                    error: function (data) {
                        alert("删除失败");
                    }
                });
                var carouselMap=window.parent.document.getElementById('LAY_demo').contentWindow.carouselMap;
                carouselMap.delete(id);
                console.log("当前轮播图Map start")//设定各种参数
                console.log(carouselMap)//设定各种参数
                console.log("当前轮播图Map end")//设定各种参数
            }else{
                alert("不知道在box中删除了什么，");
            }

        }else{
            alert("不知道删除了什么，");
        }

        $(this).parent().remove();
        if (!$(".demo .lyrow").length > 0) {
            // clearDemo()
        }
    })
}
function removeMenuClasses() {
    $("#menu-layoutit li button").removeClass("active")
}

$(document).ready(function() {
    $(".layui-nav-child .view").on('click',function(){
    	alert(11111111111111111111111);
	});
    $(".layui-nav-child .lyrow").draggable({
        zIndex:999,//zIndex主要是让选项在上层显示出来
        connectToSortable: ".demo",
        helper: "clone",
        handle: ".drag",
        // revert:'invalid',
        appendTo:'body'//加上这句就可以将选项拖拽出来
        ,start: function(e,t) {
            if (!startdrag) stopsave++;
            startdrag = 1;
        },
        drag: function(e, t) {
            t.helper.width(400)
        },
        stop: function(e, t) {
            $(".demo .column").sortable({
                opacity: .35,
                connectWith: ".column",
                start: function(e,t) {
                    if (!startdrag) stopsave++;
                    startdrag = 1;
                },
                stop: function(e,t) {
                    if(stopsave>0) stopsave--;
                    startdrag = 0;
                    // $.ajax({
                    //     type: "POST",
                    //     url: "/htmlrow/"+id,
                    //     dataType: "json",
                    //     data: {_method:'DELETE'},
                    //     cache: true,
                    //     success: function (data) {
                    //         alert("删除成功");
                    //         tableSize--;
                    //     },
                    //     error: function (data) {
                    //         alert("删除失败");
                    //     }
                    // })
                }
            });
            handleRowIds(e, t);
            if(stopsave>0) stopsave--;
            startdrag = 0;


        }
    });
    $(".layui-nav-child .box").draggable({
        zIndex:999,//zIndex主要是让选项在上层显示出来
        connectToSortable: ".column",
        // connectToSortable: ".layui-colgit -md6",
        helper:'clone',
        handle: ".drag",
        // revert:'invalid',
        appendTo:'body'//加上这句就可以将选项拖拽出来
        ,start: function(e,t) {
            if (!startdrag) stopsave++;
            startdrag = 1;
        },
        drag: function(e, t) {
            t.helper.width(400)
        },
        stop: function() {
            handleJsIds();
            if(stopsave>0) stopsave--;
            startdrag = 0;
        }
    });
    initContainer();
    // $(".demo .ui-sortable" ).droppable({
    //     drop: function( event, ui ) {
    //         // $( this )
    //         //     .addClass( "ui-state-highlight" )
    //         //     .find( "p" )
    //         //     .html( "Dropped!" );
    //         alert("放置成功");
    //     }
    // });
    // $(".demo .layui-col-md6" ).droppable({
    //     drop: function( event, ui ) {
            // $( this )
            //     .addClass( "ui-state-highlight" )
            //     .find( "p" )
            //     .html( "Dropped!" );
            // alert("放置成功");
            // var target = $item.append(recycle_icon).clone();//clone复制一份新的
            // target.appendTo($list).end().fadeIn(function () {
            //     target
            //         .animate({ width: "48px" })
            //         .find("img")
            //         .animate({ height: "36px" });
        // }
    // });

    $("#downloadModal").click(function(e) {
        e.preventDefault();
        downloadLayoutSrc();
    });

    $("#edit").click(function() {
        $("body").removeClass("devpreview sourcepreview");
        $("body").addClass("edit");
        removeMenuClasses();
        $(this).addClass("active");
        return false
    });
    $("#clear").click(function(e) {
        e.preventDefault();
        clearDemo()
    });
    $("#devpreview").click(function() {
        $("body").removeClass("edit sourcepreview");
        $("body").addClass("devpreview");
        removeMenuClasses();
        $(this).addClass("active");
        return false
    });
    $("#sourcepreview").click(function() {
        $("body").removeClass("edit");
        $("body").addClass("devpreview sourcepreview");
        removeMenuClasses();
        $(this).addClass("active");
        return false
    });
    removeElm();
})